<template>
	<view class="page-content">
		<view class="back-content">
			<view class="form-content">
				<scroll-view class="content-scrollV" :scroll-y="true">
					<view>
						<view v-for="(item,index) in pageList">
							<view class="item-view">
								<view @tap.stop="titleClick(item)">
									<view class="title-view">
										{{item.title}}
									</view>
									<view style="width: 100%; height: 1rpx;margin-left: 20rpx; background: #F0F0F0;">
									</view>
								</view>
							</view>
						</view>
					</view>
				</scroll-view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		components: {},
		computed: {

		},
		data() {
			return {
				pageList: [],
			}
		},
		onLoad(options) {

		},

		onShow() {
			this.pageList = [{
				title:'电子签名',
				type:1,
			},{
				title:'人脸识别',
				type:2,
			}];
		},
		methods: {
			// 点击单元格
			titleClick(e) {
				if (e.type === 1) {
					uni.navigateTo({
						url:'/pages/index/authgraph'
					})
				} else if (e.type === 2) {
					uni.navigateTo({
						url:'/pages/index/faceCollectPage'
					})
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.page-content {
		width: 100vw;
		height: 100vh;
		position: relative;
		
		background: #F5F9FC;
		
		// background: #F50000;
		.back-content {
			position: absolute;
			width: calc(100vw - 30rpx * 2);
			margin-left: 30rpx;
			margin-top: 30rpx;
			padding: 20rpx 0rpx;			
			//  底部安全高度，顺序不要乱
			 height: calc(100vh - constant(safe-area-inset-bottom) - 88rpx - var(--status-bar-height));
			 height: calc(100vh - env(safe-area-inset-bottom) - 88rpx - var(--status-bar-height));
			border-radius: 20rpx;
			box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.05);
			background: #FFFFFF;

			.form-content {
				width: 100%;
				height: 100%;
				display: flex;
				flex-direction: row;
				align-items: center;
				
				.content-scrollV {
					width: 100%;
					height: 100%;

					.item-view {
						width: 100%;
						text-align: left;
						vertical-align: middle;
						.title-view {
							padding: 0 20rpx;
							height: 80rpx;
							line-height: 80rpx;
						}
					}
				}
			}

		}
	}
</style>
